<template>
	<uni-search-bar @confirm="searchCityBus" placeholder="请输入" v-model="searchKey"></uni-search-bar>


	<swiper style="height: 200px;" indicator-active-color="#ff6700" indicator-color="#fff" :indicator-dots="true"
		:autoplay="true" :interval="3000" :duration="1000">
		<swiper-item v-for="(item,index) in rotateList" :key="index">
			<view class="swiper-item">
				<image :src="item.img" style="width: 100%;" mode="widthFix"></image>
			</view>
		</swiper-item>
	</swiper>

	<view class="weather" style="height: 100rpx;border: 1px solid #ccc;margin: 5px; border-radius: 5px;display: flex;justify-content: space-between; padding: 10rpx;align-items: center;
			">
		<view class="icon" style="width: 100rpx;height: 100rpx; ">
			<image style="width: 100%;height: 100%;" :src="'/static/weather/icons/'+ weatherNow.icon +'.png'" mode="">
			</image>
		</view>
		<view class="text" style="font-size: 50rpx;margin-left: 10px;">
			{{weatherNow.temp}}°C
		</view>
		<view class="text" style="font-size: 34rpx;margin-left: 10rpx;">
			{{weatherNow.text}}
		</view>
		<view class="text" style=" margin-left: 10rpx;">
			{{weatherNow.windDir}} {{weatherNow.windScale}}级
		</view>
		<view>
			<view class="text" style="margin-left: 10rpx;">
				体感温度： {{weatherNow.feelsLike }}°C
			</view>
			<view class="text" style="margin-left: 10rpx;">
				湿度： {{weatherNow.humidity }}%
			</view>
		</view>
	</view>

</template>

<script setup>
	import {
		onLoad
	} from "@dcloudio/uni-app"
	import {
		ref
	} from 'vue'
	import {
		CONFIG
	} from '../../utils/config.js';
	const searchKey = ref("")

	function searchCityBus() {
		if (searchKey.value === '') {
			uni.showToast({
				title: '请输入关键字',
				icon: 'none'
			})
			return
		} else {
			window.location.href =
				`https://uri.amap.com/line?name=${searchKey.value}&city=029&callnative=1`
		}
	}
	onLoad(() => {
		getLuinbo()
		getWeather()
	})
	let rotateList = ref([])

	async function getLuinbo() {
		console.log(CONFIG.leanbase + "/1.1/classes/lunbo")
		let res = await uni.$get(CONFIG.leanbase + "/1.1/classes/lunbo")
		rotateList.value = res.data.results
	}

	let weatherNow = ref({})
	async function getWeather() {
		let res = await uni.$get(CONFIG.hefeng_now, {
			key: CONFIG.hefeng_key,
			location: CONFIG.hefeng_location,
		})
		if (res.data.code === '200') {
			weatherNow.value = res.data.now
		}
	}
</script>

<style lang="scss" scoped>
	.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.logo {
		height: 200rpx;
		width: 200rpx;
		margin-top: 200rpx;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 50rpx;
	}

	.text-area {
		display: flex;
		justify-content: center;
	}

	.title {
		font-size: 36rpx;
		color: #8f8f94;
	}
</style>